<template>
	<view>
		<view class="bean_top">
			<view>
				<view style="font-size: 30rpx;letter-spacing: 2rpx;text-align: center;">账户金豆余额</view>
				<u-gap height="20"></u-gap>
				<view style="text-align: center;font-weight: 500;font-size: 36rpx;">{{userInfo.balance}}</view>
			</view>
			<view>
				<view style="font-size: 30rpx;letter-spacing: 2rpx;">已完成任务数</view>
				<u-gap height="20"></u-gap>
				<view style="text-align: center;font-weight: 500;font-size: 36rpx;">{{all_get}}</view>
			</view>
		</view>

		<view class="task">
			<view style="display: flex;">
				<view class="tasktext1">新手任务</view>
				<view class="tasktext2">做任务，领金豆，解锁更多剧集！</view>
			</view>
			<view style="background-color: #ffffff;height: 50rpx;margin: 0 20rpx;border-radius: 0 20rpx 0 0;"></view>
		</view>


		<view class="admin_box">
			<view style="display: flex;justify-content: space-between;align-items: center;">
				<image class="avatar" src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/libao.png"></image>
				<view>
					<view class="dou">
						<view class="dou1">首冲大礼包</view>
						<image src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/jindou.png" style="width: 30rpx;height: 30rpx;"></image>
						<view class="dou2">+50金豆</view>
					</view>
					<view class="nickname">充一次送两次金豆</view>
				</view>
			</view>
			<view v-if="userInfo.finish && userInfo.finish.libao" class="recharge" style="background-color: #bcbcbc;">
				<u-button size="mini" color="#bcbcbc" shape="circle" icon="已完成" iconColor="#fff"></u-button>
			</view>
			<view v-else class="recharge" @click="libao">
				<u-button size="mini" color="#e74202" shape="circle" icon="去完成" iconColor="#fff"></u-button>
			</view>
		</view>

		<view class="admin_box">
			<view style="display: flex;justify-content: space-between;align-items: center;">
				<image class="avatar" src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/yonghu.png"></image>
				<view>
					<view class="dou">
						<view class="dou1">解锁智能推荐</view>
						<image src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/jindou.png" style="width: 30rpx;height: 30rpx;"></image>
						<view class="dou2">+50金豆</view>
					</view>
					<view class="nickname">获取您的用户信息，解锁智能推荐</view>
				</view>
			</view>
			<view v-if="userInfo.finish && userInfo.finish.jiesuo" class="recharge" style="background-color: #bcbcbc;">
				<u-button size="mini" color="#bcbcbc" shape="circle" icon="已完成" iconColor="#fff"></u-button>
			</view>
			<view v-else class="recharge" @click="jiesuo">
				<u-button size="mini" color="#e74202" shape="circle" icon="去完成" iconColor="#fff"></u-button>
			</view>
		</view>

		<view class="admin_box">
			<view style="display: flex;justify-content: space-between;align-items: center;">
				<image class="avatar" src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/dingyue.png"></image>
				<view>
					<view class="dou">
						<view class="dou1">订阅提醒</view>
						<image src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/jindou.png" style="width: 30rpx;height: 30rpx;"></image>
						<view class="dou2">+15金豆</view>
					</view>
					<view class="nickname">订阅我，新剧上新不迷路</view>
				</view>
			</view>
			<view v-if="userInfo.finish && userInfo.finish.dingyue" class="recharge" style="background-color: #bcbcbc;">
				<u-button size="mini" color="#bcbcbc" shape="circle" icon="已完成" iconColor="#fff"></u-button>
			</view>
			<view v-else class="recharge" @click="dingyue">
				<u-button size="mini" color="#e74202" shape="circle" icon="去完成" iconColor="#fff"></u-button>
			</view>
		</view>

		<view class="admin_box">
			<view style="display: flex;justify-content: space-between;align-items: center;">
				<image class="avatar" src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/qiandao.png"></image>
				<view>
					<view class="dou">
						<view class="dou1">新人签到</view>
						<image src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/jindou.png" style="width: 30rpx;height: 30rpx;"></image>
						<view class="dou2">+30金豆</view>
					</view>
					<view class="nickname">每日签到领金豆</view>
				</view>
			</view>
			<view v-if="userInfo.finish  && userInfo.finish.xinren" class="recharge" style="background-color: #bcbcbc;" @click="xinren">
				<u-button size="mini" color="#bcbcbc" shape="circle" icon="已完成" iconColor="#fff"></u-button>
			</view>
			<view v-else class="recharge" @click="xinren">
				<u-button size="mini" color="#e74202" shape="circle" icon="去完成" iconColor="#fff"></u-button>
			</view>
		</view>


		<view class="admin_box">
			<view style="display: flex;justify-content: space-between;align-items: center;">
				<image class="avatar" src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/yaoqing.png"></image>
				<view>
					<view class="dou">
						<view class="dou1">邀请好友</view>
						<image src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/jindou.png" style="width: 30rpx;height: 30rpx;"></image>
						<view class="dou2">+{{vk.vuex.get('$app.appinfo.beannumber')}}金豆</view>
					</view>
					<view class="nickname">每邀请1个好友奖励{{vk.vuex.get('$app.appinfo.beannumber')}}金豆</view>
				</view>
			</view>
			<view class="recharge" @click="yaoqing">
				<u-button size="mini" color="#e74202" shape="circle" icon="去邀请" iconColor="#fff"></u-button>
			</view>
		</view>

		<view class="admin_box" v-if="vk.vuex.get('$app.appinfo.wxad_switch')">
			<view style="display: flex;justify-content: space-between;align-items: center;">
				<image class="avatar" src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/chongzhi.png"></image>
				<view>
					<view class="dou">
						<view class="dou1">看广告领金豆</view>
						<image src="https://hedianpics.oss-cn-hangzhou.aliyuncs.com/static/jindou.png" style="width: 30rpx;height: 30rpx;"></image>
						<view class="dou2"></view>
					</view>
					<view class="nickname">限量赠送，先到先得</view>
				</view>
			</view>
			<view class="recharge" @click="take_wxad">
				<u-button size="mini" color="#e74202" shape="circle" icon="看广告" iconColor="#fff"></u-button>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				kefuurl: "",
				userInfo: vk.vuex.get('$user.userInfo'),
				all_get: 0,
				sessionKey: "",
				encryptedKey: ""
			}
		},
		onLoad() {

		},
		onShow() {
			this.all_get = 0
			this.kefuurl = vk.vuex.get('$app.appinfo.customerServicesQrcodeUrl');
			//检查登录情况，没注册自动用openid注册，注册过的直接登录
			let udata={
				appid: vk.vuex.get('$app.appid'),
				appname: vk.vuex.get('$app.appname'),
				appsecret: "",
				type: ""
			};
			vk.myfn.userlogin(udata,this.login_success);
		},
		methods: {
			//登录成功后执行的操作
			login_success(res){
				console.log("res=", res);
				this.sessionKey = res.sessionKey || "0";
				this.encryptedKey = res.encryptedKey;
				// 成功后的逻辑
				console.log("注册登录成功", vk.vuex.get('$user.userInfo'));
				this.userInfo = vk.vuex.get('$user.userInfo')
				this.yiwancheng()
			},
			yiwancheng() {
				this.all_get = 0;
        if (!this.userInfo.finish) {
          return
        }
				if (this.userInfo.finish.dingyue) {
					this.all_get += 1
				}
				if (this.userInfo.finish.jiesuo) {
					this.all_get += 1
				}
				if (this.userInfo.finish.libao) {
					this.all_get += 1
				}
				if (this.userInfo.finish.shoujihao) {
					this.all_get += 1
				}
				if (this.userInfo.finish.xinren) {
					this.all_get += 1
				}
			},
			async libao() {
				console.log("libao");
				vk.callFunction({
					url: 'client/user/kh/taskCenter',
					title: '请求中...',
					data: {
						type: "libao"
					},
					success: (data) => {
						// console.log("data");
						if (data.recharge == 0) {
							vk.navigateTo("/pages_sub/recharge/recharge");
						} else {
							this.userInfo.finish.libao = true
							this.userInfo.balance += 50
							toast('任务已完成', 'success');
						}
					}
				});
			},
			jiesuo() {
				console.log("jiesuo");
				//如果已授权
				if (vk.vuex.get('$user.userInfo.nickname')) {
					vk.callFunction({
						url: 'client/user/kh/taskCenter',
						title: '请求中...',
						data: {
							type: "jiesuo",
						},
						success: (data) => {
							this.userInfo.finish.jiesuo = true
							this.userInfo.balance = this.userInfo.balance + data.jiangli
							toast('任务已完成', 'success');
						}
					});
				} else {
					uni.navigateTo({
						url: "/pages_sub/setUserinfo/setUserinfo"
					})
				}

			},
			dingyue() {
				let that = this;
				uni.requestSubscribeMessage({
					tmplIds: vk.vuex.get('$app.msglist'),
					success(res) {
						console.log("订阅成功");

						that.dingyue_cloud()
					}
				})
			},
			dingyue_cloud() {
				vk.callFunction({
					url: 'client/user/kh/dingyue',
					showLoading: false,
					data: {
						msglist: vk.vuex.get('$app.msglist'),
						platform: "weixin",
						tv_id: "no",
						tv_name: "no"
					},
				})

				vk.callFunction({
					url: 'client/user/kh/taskCenter',
					title: '请求中...',
					data: {
						type: "dingyue"
					},
					success: (data) => {
						this.userInfo.finish.dingyue = true
						this.userInfo.balance = this.userInfo.balance + data.jiangli
						toast('任务已完成', 'success');
					}
				});
			},
			xinren() {
				uni.navigateTo({
					url: "/pages_sub/signin/signin"
				})
				//企业微信客服功能
				// wx.openCustomerServiceChat({
				// 	extInfo: {
				// 		url: this.kefuurl
				// 	},
				// 	corpId: 'wwc6b9dde9f3e07199',
				// 	success(res) {
				// 		调用客服成功
				// 	}
				// })
			},
			yaoqing() {
				uni.navigateTo({
					url: "/pages_sub/invite/invite"
				})
			},
			take_wxad() {
				uni.navigateTo({
					url: "/pages_sub/signin/wxads"
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #fafafa;
	}

	.bean_top {
		display: flex;
		justify-content: space-between;
		padding: 20rpx 100rpx;
		color: #fff;
		background-color: #f36c3a;
	}

	.task {
		padding-top: 20rpx;
		background-color: #f36c3a;
		display: flex;
		flex-direction: column;
	}

	.tasktext1 {
		color: #000;
		background-color: #fff;
		margin: 0 0 0 20rpx;
		padding: 20rpx;
		border-radius: 20rpx 20rpx 0 0;
		font-size: 32rpx;
		font-weight: 600;
		letter-spacing: 2rpx;
	}

	.tasktext2 {
		color: #fff;
		margin: 28rpx 0 0 30rpx;
		border-radius: 0 0 0 20rpx;
		font-size: 24rpx;
	}

	.admin_box {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 20rpx;
		padding: 30rpx;
		margin-top: -20rpx;
		background-color: #fff;
		border-radius: 0 0 20rpx 20rpx;
	}

	.avatar {
		width: 60rpx;
		height: 60rpx;
		padding: 20rpx;
		border-radius: 10rpx;
		background-color: #ffe9e1;
	}

	.nickname {
		color: #bcbcbc;
		font-size: 24rpx;
		margin: 10rpx 0 0 20rpx;
	}

	.dou {
		display: flex;
		align-items: center;
	}

	.dou1 {
		color: #000000;
		font-weight: 600;
		font-size: 30rpx;
		margin: 0 20rpx 0 20rpx;
	}

	.dou2 {
		color: #ff5500;
		font-size: 26rpx;
		font-weight: 600;
	}

	.recharge {
		color: #fff;
		background-color: #e74202;
		padding: 10rpx 20rpx;
		border-radius: 30rpx;
		text-align: center;
	}
</style>
